<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html ng-app="detailApp">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">
    <title>E.gift平台</title>
    <meta name="keywords" content="E.gift平台">
    <meta name="description" content=">E.gift平台">

    <!--[if lt IE 9]>
    <meta http-equiv="refresh" content="0;ie.html"/>
    <![endif]-->
    <%@ include file="/include/egiftlibs.jsp" %>
    <script src="${cxp}/js/detailAngular.js"></script>
    <style type="text/css">
        .bot {
            height: 72px;
            background-color: #4B4947;
        }
    </style>
</head>
<body ng-controller="detailController">
<input type="hidden" id="productId" value="${id}">

<div id="top">
    <div id="top_main">
        <div id="hello">
        <span>欢迎光临！
<c:choose>
    <c:when test="${user != null}">
        ${user.name}
    </c:when>
    <c:otherwise>
        <a href="<c:url value="/home/to_login" />">登录</a>
    </c:otherwise>
</c:choose>
		</span>
        </div>
    </div>
</div>
<div id="serach">
    <div class="logo">
        <img style="margin-top:5px;" src="${cxp}/images/logo.png" alt="">
    </div>
    <div class="sou">
        <div class="sousuo">
            <input type="text" ng-model="giftName" class="kuang" value="" style="color:#999;font-size:14px">
            <input style="display: none" id="customerId" value="${user.id}">

            <div class="souzi"><a href="#" ng-click="searchByName()">搜索</a></div>
        </div>
    </div>
</div>
<!--导航-->
<div id="daohang-wrapper">
    <div id="daohang">
        <div class="dhleft">
            <a href="#">礼品类别</a>

            <div class="lanren" ng-show="showIndex">
                <ul class="nav1" style="margin-bottom:0px;">
                    <li ng-repeat="giftType in giftTypes" class="li1">
                        <a href="#">{{giftType.oneTypeName}}</a>
                        <ul class="nav01">
                            <li class="li2" ng-repeat="twoType in giftType.twoLevelTypeList">
                                <a href="#" ng-click="searchByType(twoType.id)">{{twoType.name}}</a>
                            </li>
                        </ul>
                    </li>
                    <li class="li1" style="margin-bottom: 550px;">
                    </li>
                </ul>
            </div>
        </div>
        <div class="dhright">
            <ul>
                <li><a href="#" ng-class="indexClass" ng-click="changeTab(true)">首页</a></li>
                <c:choose>
                    <c:when test="${user != null}">
                        <li><a href="#" ng-class="caseClass" ng-click="changeTab(false)">礼物案例</a></li>
                    </c:when>
                    <c:otherwise>
                        <li><a href="<c:url value="/home/to_login" />">礼物案例</a></li>
                    </c:otherwise>
                </c:choose>
            </ul>
        </div>
    </div>
</div>
<div class="bg" ng-show="showIndex && !detailFlag"></div>
<div id="main" ng-show="showIndex">
    <div class="mainleft">
        <div id="content">
            <div class="tuijian">
                <div class="right">
                    <div class="gift-wrapper">
                        <div class="gift-block" ng-repeat="gift in giftList">
                            <a target="_blank" href="<c:url value="/home/detail?id={{gift.productId}}" />">
                                <img ng-src="{{gift.imageUrl}}" alt=""/>
                            </a>
                            <div class="bottom-info">
                                <span class="text">{{gift.name}}</span>
                                <span class="cash">￥{{gift.price}}</span>
                            </div>
                        </div>
                        <div class="fenye">
                            <span ng-click="searchPagination(pageCount)">尾页</span>
                            <span ng-click="searchPagination(currentPage + 1)">下一页</span>
                            <span ng-click="searchPagination(currentPage - 1)">上一页</span>
                            <span ng-click="searchPagination(1)">首页</span>
                        </div>
                        <div class="clear"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div id="content1" ng-show="!showIndex && !detailFlag">
    <div class="tuijian">
        <div class="right">
            <div class="title-span">
            </div>
            <div class="gift-wrapper">
                <div class="gift-block" ng-repeat="case in caseList">
                    <a target="_blank" class="media" href="{{case.pdfUrl}}">
                        <img ng-src="{{case.imageUrl}}" alt=""/>
                    </a>

                    <div class="bottom-info">
                        <span class="text">{{case.name}}</span>
                    </div>
                </div>
                <div class="fenye">
                    <span ng-click="searchCasePagination(casePageCount)">尾页</span>
                    <span ng-click="searchCasePagination(caseCurrentPage + 1)">下一页</span>
                    <span ng-click="searchCasePagination(caseCurrentPage - 1)">上一页</span>
                    <span ng-click="searchCasePagination(1)">首页</span>
                </div>
                <div class="clear"></div>
            </div>
        </div>
    </div>
</div>
<div class="erz" ng-show="detailFlag">
    <div class="erji">
        <div class="erjitop">
            <a>礼品全部分类></a><a>${product.oneLevelType}></a><a>${product.twoLevelType}</a>
        </div>
        <div class="erjixia">
            <div class="erjijz">
                <div class="e_left">
                    <!---焦点图--->
                    <div class="ban" id="demo1">
                        <div class="ban2" id="ban_pic1">
                            <div class="prev1" id="prev1"><img src="${cxp}/images/index_tab_l.png" width="28" height="51"  alt=""/></div>
                            <div class="next1" id="next1"><img src="${cxp}/images/index_tab_r.png" width="28" height="51"  alt=""/></div>
                            <ul>
                                <c:forEach var="imageUrl" items="${product.imagesList}" varStatus="status">
                                    <li><a href="javascript:;"><img ng-src="${imageUrl}" width="418" height="418" alt=""/></a></li>
                                </c:forEach>
                            </ul>
                        </div>
                        <div class="min_pic">
                            <div class="prev_btn1" id="prev_btn1"><img src="${cxp}/images/feel3.png" width="29" height="80"  alt=""/></div>
                            <div class="num clearfix" id="ban_num1">
                                <ul>
                                    <c:forEach var="imageUrl" items="${product.imagesList}" varStatus="status">
                                        <li><a href="javascript:;"><img ng-src="${imageUrl}" width="80" height="80" alt=""/></a></li>
                                    </c:forEach>
                                </ul>
                            </div>
                            <div class="next_btn1" id="next_btn1"><img src="${cxp}/images/feel4.png" width="29" height="80"  alt=""/></div>
                        </div>
                    </div>
                </div>
                <div class="e_right">
                    <h1>名称：${product.name}</h1>
                    <p>价格：<span style="color:#c40000;font-weight:bold;font-size:14px;">￥${product.price}</span></p>
                    <p>编码:${product.id}</p>
                    <p>类别：${product.oneLevelType}</p>
                    <p>二级类别：${product.twoLevelType}</p>
                    <p>品牌：${product.brand}</p>
                    <p>材质：${product.material}</p>
                    <p>规格：${product.specifications}</p>
                    <p>包装：${product.packaging}</p>
                    <p>备注：${product.description}</p>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="${cxp}/js/pic_tab.js"></script>
<script>
    $(function () {
        $('a.media').media();
        $('#demo1').banqh({
            box:"#demo1",//总框架
            pic:"#ban_pic1",//大图框架
            pnum:"#ban_num1",//小图框架
            prev_btn:"#prev_btn1",//小图左箭头
            next_btn:"#next_btn1",//小图右箭头
            pop_prev:"#prev2",//弹出框左箭头
            pop_next:"#next2",//弹出框右箭头
            prev:"#prev1",//大图左箭头
            next:"#next1",//大图右箭头
            pop_div:"#demo2",//弹出框框架
            pop_pic:"#ban_pic2",//弹出框图片框架
            pop_xx:".pop_up_xx",//关闭弹出框按钮
            mhc:".mhc",//朦灰层
            autoplay:true,//是否自动播放
            interTime:3000,//图片自动切换间隔
            delayTime:300,//切换一张图片时间
            pop_delayTime:300,//弹出框切换一张图片时间
            order:0,//当前显示的图片（从0开始）
            picdire:true,//大图滚动方向（true为水平方向滚动）
            mindire:true,//小图滚动方向（true为水平方向滚动）
            min_picnum:4,//小图显示数量
            pop_up:true//大图是否有弹出框
        })
    })
</script>
</body>
</html>